<template>
    <div class="wrapper" ref="wrapper1">
        <div class="content">
            <slot></slot>
        </div>
    </div>
</template>
<script>
import BScroll from "better-scroll";
export default {
    name: "PublicScroll",
    props:{
        probeType:{
            type:Number,
            default:0
        },
        pullUpLoad:{
            type:Boolean,
            default: false
        }
    },
    data(){
        return {
            bs:Object,
        }
    },
    methods:{
        //返回顶部的方法
        scrollTo(x,y,time=500){
            this.bs&&this.bs.scrollTo(x,y,time)
        },
        //加载大量图片后重新加载高度
        scrollRefresh(){
            this.bs&&this.bs.refresh()
        },
        //加载更多后，当前已经不是底部，重置底部位置
        finishPullUp(){
            this.bs&&this.bs.finishPullUp()
        }
    },
    mounted() {
        this.bs=new BScroll(this.$refs.wrapper1,{
            probeType:this.probeType,//监视滑动
            click:true,//
            pullUpLoad:this.pullUpLoad,//底部下拉事件开启
            // mouseWheel: true, //鼠标滚轮滚动
            // disableMouse: false,// 启用鼠标拖动
            disableTouch: false,// 启用手指触摸
        })
        if(this.probeType===3||this.probeType===2){
            this.bs.on('scroll',(position)=>{
                this.$emit('scrollY',position.y)
            })
        }
        if(this.pullUpLoad){
            this.bs.on('pullingUp',()=>{
                this.$emit('loadMore')
            })
        }
    },
}
</script>
<style scoped>
.wrapper{
    height: 100%;
    overflow: hidden;
}
</style>
